<template>
	<view class="ver bgf5 px40 flex flexC flexCol flexJC" :style="{height: pageH}">
		<view class="flex flexC mt-50">
			<image class="w38" src="/static/img/icon/meituan.png" mode="aspectFill"></image>
			<image class="w38 ml10" src="/static/img/icon/dou.png" mode="aspectFill"></image>
			<image class="w38 ml10" src="/static/img/icon/ks_icon.png" mode="aspectFill"></image>
			
		</view>
		<view class="fs16 bold6 c00 mt20">美团/抖音/快手自助验券</view>
		<view class="mt30 flex flexC w-14 borb">
			<input type="text" class="flex1 pl10 py9" v-model="code" placeholder="点击输入卡券兑换码" placeholder-class="cbe"/>
			<image @click="scan" class="w18 ml10 p10" src="/static/img/icon/scan.png" mode="aspectFill"></image>
		</view>
		<view class="mt10 flex flexC w-14 borb" @click="clickSelectShop">
			<input type="text" v-model="name" class="flex1 pl10 py9" disabled="disable" placeholder="请点击选择店铺" placeholder-class="cbe"/>
			<image  class="w18 ml10 p10" src="/static/img/icon/shop.png" mode="aspectFill"></image>
		</view>
		<view @click="check" class="w-15 py10 bg57 r40 flex flexC flexJC mt16">兑换</view>
		
		<!-- 店铺选择 -->
		<uni-popup ref="shopPicker" type="bottom">
			<shop-list @search="search" :list="list" @onSelectShop="onSelectShop" @close="onClose"></shop-list>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		props: {
			pageH: {
				type: String,
				default: '100vh'
			}
		},
		data() {
			return {
				code: '',
				selectShop:null,
				name:'',
				list:[]
			};
		},
		onLoad() {
			
		},
		mounted() {
			this.getShopList();
			
		},
		methods: {
			
			search(e){
				console.info(e);
				this.keyword = e;
				this.getShopList();
			},
			
			onClose(){
				this.$refs.shopPicker.close();
			},
			clickSelectShop(){
				this.$refs.shopPicker.open();
				
			},
			
			
			// 选择店铺
			onSelectShop(item) {
				this.selectShop = item;
				this.isSearch = false;
				this.name = this.selectShop.name;
				this.$refs.shopPicker.close();
				console.info("====name===="+this.name);
			
			},
			getShopList() {
				let param = {
					keyword: this.keyword,
					orgId: 27,
					lat: uni.getStorageSync("lat"),
					lng: uni.getStorageSync("lng"),
				};
				let that = this;
				this.$api.shopList(param).then(res => {
					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.list = res.data;
					
			
					} else {
			
					}
				})
			},
			
			check(){
				
				if(this.code == ''){
					
					uni.showToast({
						title:"请输入兑换码",
						icon:'none'
					})
					return;
				}
				let param = {
					code: this.code,
					shop_id:this.selectShop.id
					
				};
			
				let that = this;
				if(this.code.length <= 14){
					this.$api.mtCheckCode(param).then(res => {
						console.info(JSON.stringify(res));
						if (res.code == 1) {
							uni.navigateTo({
								url:'../shop/meituan?id='+res.data+"&room_id="+that.room_id
							})
						} else {
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}
					})
				}else{					
					this.$api.douCheckCode(param).then(res => {
						console.info(JSON.stringify(res));
						if (res.code == 1) {
							if(res.data.type == 'ks'){
								uni.navigateTo({
									url:'../shop/ks?id='+res.data.id+"&type="+res.data.type
								})
							}else{
								uni.navigateTo({
									url:'../shop/dou?id='+res.data.id+"&type="+res.data.type
								})
							}
							
						} else {
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}
					})
				}

			},
			
			scan(){
				console.info("===scan==");
				let that = this;
				uni.scanCode({
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						that.code = res.result;
				
					},
					fail:function(res){
						
						console.info(res);
					}
				});
			},
			getCheck(){
				
				
			},
			
			getData(selectShop) {
				console.log(selectShop)
			}
		}
	}
</script>

<style lang="scss" scoped>
.ver {
	.w38 {width: 76rpx;height: 76rpx;}
	.w18 {width: 36rpx;height: 36rpx;}
	.mt-50 {margin-top: -400rpx;position: relative;}
}
</style>
